import Vuex from 'vuex'
import Vue from 'vue'
import user from './modules/user'
import home from './modules/home'
Vue.use(Vuex)
import { CHANGECOUNT } from './types'
const myPlugin = store => {
  // 当 store 初始化后调用
  store.subscribe((mutation, state) => {
    // 每次 mutation 之后调用
    // mutation 的格式为 { type, payload }
    // console.log(mutation, state)
    localStorage.setItem('qqqqqqqq', JSON.stringify(state))
  })
}


let initData = JSON.parse(localStorage.getItem('qqqqqqqq')) || {
  count: 100,
  count2: 999
}
export default new Vuex.Store({
  state: initData,
  mutations: {
    // store  $store  commit('changeCount',10)
    // 不能写异步  异步需要写道actions中
    [CHANGECOUNT](state, n) {
      state.count += n
      // localStorage.setItem('qqqqqqqq', JSON.stringify(state))
    },
    changeName() {
      console.log(66666)
    }
  },
  getters: {
    //可以理解成vuex的计算属性
    type(state) {
      return state.count % 2 ? '奇数' : '偶数'
    }
  },
  actions: {
    // store  $store  dispatch('qqq',3)
    [CHANGECOUNT](store, n) {
      setTimeout(() => {
        store.commit(CHANGECOUNT, n)
      }, 2000);
    }
  },
  modules: {
    user, home
  },
  plugins: [myPlugin]
})

/*
state 存放公用数据

mutations 存放 修改state的方法   commit

actions 存放的 一些异步函数,异步函数执行之后 如果想要改动state的数据 还是去触发mutations的方法


getters 不常用   vuex的计算属性


modules 模块化 把一个大对像 拆分成不同的小模块方便开发和维护


mapState  mapGetters   mapActions  mapMutations


vuex的数据持久化(刷新不丢失)  ====> 结合localStorage|sessionStorage

*/